<template>
  <wd-form ref="formRef" :model="model" :rules="rules">
    <wd-cell-group>
      <wd-input label="姓名" label-width="100px" prop="real_name" clearable v-model="model.real_name"
        placeholder="请输入姓名" />
      <wd-input label="银行卡号" label-width="100px" prop="account" clearable v-model="model.account" placeholder="请输入卡号" />
      <wd-input label="银行名称" label-width="100px" prop="bank" clearable v-model="model.bank" placeholder="请输入银行名称" />
      <wd-input label="支行名称" label-width="100px" prop="subbank" clearable v-model="model.subbank"
        placeholder="请输入支行名称" />


    </wd-cell-group>

  </wd-form>
</template>
<script setup>
const formRef = ref();
const model = reactive({
  account: "",
  real_name: "",
  subbank: "",
  bank: ""
})

const rules = {
  account: [{ required: true, message: '请输入卡号' }],
  real_name: [{ required: true, message: '请输入姓名' }],
  subbank: [{ required: true, message: '请输入支行名称' }],
  bank: [{ required: true, message: '请输入银行名称' }],
}

function sumbit() {
  return new Promise((resolve, reject) => {
    formRef.value
      .validate()
      .then(({ valid, errors }) => {
        resolve(model)
      })
      .catch((error) => {
        reject(error)
        console.log(error, 'error')
      })
  })


}

defineExpose({
  sumbit
})

</script>
<style lang="scss" scoped></style>
